import { reactive, toRefs } from "@vue/composition-api";
function useFeatureX() {
  const state = reactive({
    foo: 1,
    bar: 2
  });

  // logic operating on state

  // convert to refs when returning
  // toRefs is useful when returning a reactive object from a composition function so that the consuming component can destructure / spread the returned object without losing reactivity:
  return toRefs(state);
}

export default {
  setup() {
    // can destructure without losing reactivity
    const { foo, bar } = useFeatureX();

    return {
      foo,
      bar
    };
  }
};
